<template>
  <div class="top">
    <div class="bian">
      <el-row>
        <el-col :span="4">
          <el-input
            placeholder="请输入内容"
            prefix-icon="el-icon-search"
            v-model="listQuery.userid"
            size="mini"
          >
          </el-input
        ></el-col>
        <el-col :span="14">
          <el-button type="primary" @click="cha()" size="mini"
            ><i class="el-icon-search"></i>搜索</el-button
          >
          <el-button type="primary" @click="chongzhi" size="mini"
            ><i class="el-icon-refresh"></i>重置</el-button
          >
        </el-col>
        <el-col :span="6">
          <el-button
            type="primary"
            style="margin-right: 80px"
            size="mini"
            @click="tianjia"
            >添加</el-button
          >
        </el-col>
      </el-row>
    </div>

    <el-table :data="list" style="width: 100%">
      <el-table-column label="工作日期" width="280">
        <template slot-scope="scope">
          <span style="margin-left: 10px">{{ scope.row.workdate }}</span>
        </template>
      </el-table-column>
      <el-table-column label="工作总结" width="280">
        <template slot-scope="scope">
          <span>{{ scope.row.worksummary }}</span>
        </template>
      </el-table-column>
      <el-table-column label="电话号码" width="280">
        <template slot-scope="scope">
          <span>{{ scope.row.mobile }}</span>
        </template>
      </el-table-column>
      <el-table-column label="提交时间" width="280">
        <template slot-scope="scope">
          <span>{{ scope.row.submitdate }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="220px">
        <template slot-scope="scope">
          <el-button size="mini" @click="bianji(scope.row)">编辑</el-button>
          <el-button size="mini" @click="handleEdit(scope.row)">查看</el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.row.worklogid)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total, sizes,prev, pager, next,jumper"
        :page-size="listQuery.pageSize"
        :page-sizes="[2, 4, 8]"
        :current-page.sync="listQuery.pageNum"
        :total="total"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import { loglist, logdelete,logdetaildelete1 } from "@/api/work";
export default {
  data() {
    return {
      operateType: null,
      listQuery: {
        keyword: null,
        nameCn: null,
        pageNum: 1,
        pageSize: 4,
        userid: null,
      },
      list: null,
      total: null,
      // listLoading: true,
    };
  },
  created() {
    this.cha();
  },
  methods: {
    cha() {
      //查询分页
      // this.listLoading = true;
      loglist(this.listQuery).then((response) => {
        // this.listLoading = false;
        this.list = response.data.records;
        this.total = response.data.total;
        this.totalPage = response.data.pages;
        this.pageSize = response.data.size;
        console.log("查询成功");
      });
    },
    handleSizeChange(val) {
      this.listQuery.pageNum = 1;
      this.listQuery.pageSize = val;
      this.cha();
    },
    handleCurrentChange(val) {
      this.listQuery.pageNum = val;
      this.cha();
    },
    chongzhi() {
      this.listQuery.userid = null;
      this.cha();
    },
    tianjia() {
      this.$router.push({ path: "/work/add" });
    },
    bianji(row) {
      this.$router.push({ path: "/work/add", query: { row } });
    },
    handleEdit(index, row) {
      console.log(index, row);
    },
    handleDelete(id) {
      //删除
      logdelete(id).then((response) => {
      logdetaildelete1(id).then((response) => {});
        this.cha();
      });
    },
  },
};
</script>

<style>
.top {
  width: 100%;
  height: 100%;
  border: 1px solid rgb(234, 229, 229);
  border-radius: 10px;
  box-shadow: 1px 1px 20px rgb(230, 223, 223);
  padding: 13px;
}
.bian {
  border-bottom: solid 1px rgb(170, 164, 164);
  padding: 5px 0 15px 0;
}
.pagination-container {
  margin-right: 80px;
}
</style>